<!--
- Author:   .
- Date:    2018/1/11 0011.
- File:    积分/经验值提现到银行卡.
-->
<template>
  <div>
    <div class="Withdrawals">
      <ul>
        <p class="pl20" style="line-height: 35px;" v-if="type == '3'">当前可用云宝: <span>{{memberInfo.stock}}</span>
          <span>, 可转出：{{stockTransferMax | toFixed(0)}}</span></p>
        <p class="pl20" style="line-height: 35px;" v-if="type == '2'">当前可用: <span>{{memberInfo.freeze_balance}}</span>
        </p>
        <p class="pl20" style="line-height: 35px;" v-if="type == '1'">当前可用经验值: <span>{{memberInfo.balance}}</span></p>
        <li><label><span class="nim">提现金额</span>
          <input type="tel" placeholder="请输入提现金额" v-model="withdrawMoney">
        </label></li>
      </ul>
    </div>
    <p class="withr">提现金额需为100的倍数<br/>提现时间固定每周五，到账时间固定每周一<br/>提现将扣除{{memberInfo.w_rate == '0.05' ? '5%' : memberInfo.w_rate}}手续费，实际到账金额为：<span>{{realMoney | toFixed(2)}}</span>元
    </p>
    <div class="addbank" v-show="bankcardList.requested && bankcardList.data.length <= 0" @click="gotoAddBankcard">
      <a>+添加银行卡</a>
    </div>
    <div class="Withdrawals mt10" v-show="bankcardList.requested && bankcardList.data.length > 0">
      <ul>
        <li>
          <label><span class="nim">开户名</span><input type="text" disabled="disabled" placeholder="请输入真实姓名" v-model="bankcard.account_name"></label>
        </li>
        <li><label><span class="nim">开户行</span>{{bankcard.bank_name}}</label></li>
        <li>
          <label><span class="nim">卡号</span><input type="tel" style="width: 9.5rem" disabled="disabled" placeholder="请输入银行卡号" v-model="bankcard.member_bank_num"><span @click="gotoBankcardList">切换</span></label>
        </li>
        <li>
          <label><span class="nim">联系电话</span><input type="tel" disabled="disabled" placeholder="请输入联系电话" v-model="bankcard.member_mobile"></label>
        </li>
      </ul>
    </div>
    <!--<p class="tistext2" v-show="type == '2'">此类型将七天后到账</p>-->
    <div class="pl20 pr20 mt35">
      <a class="but_1 wauto disb tc" @click="confirmPwd">提交</a>
    </div>
    <footer-tab></footer-tab>
  </div>
</template>

<script>
  import {mapModules, mapRules} from 'vuet'
  import payPwd from '../../components/payPwd'

  export default {
    mixins: [
      mapModules({bankcardList: 'bankcardList', memberInfo: 'memberInfo'}),
      mapRules({need: ['memberInfo', 'bankcardList']})
    ],
    data() {
      return {
        type: this.$route.query.type, // 2 积分 3 股权
        bankcardId: this.$route.query.bankcard || '3',
        withdrawMoney: '',
        bankcardExist: false
      }
    },
    components: {},
    watch: {
      withdrawMoney: function (newValue) {
        if (newValue == '') {
          return
        }
        let maxMoney = 0
        if (this.type == '1') {
          maxMoney = this.memberInfo.balance
        } else if (this.type == '2') {
          maxMoney = this.memberInfo.freeze_balance
        } else if (this.type == '3') {
          maxMoney = this.stockTransferMax.toFixed(0)
        }
        if (parseFloat(newValue) > parseFloat(maxMoney)) {
          this.$toast('超出了最大可用额')
          this.withdrawMoney = maxMoney
        }
      }
    },
    created() {
    },
    computed: {
      // 可转出的股权积分
      stockTransferMax: function () {
        if (this.memberInfo.stock) {
          return this.memberInfo.stock * 0.15
        }
        return 0
      },
      // 抵扣的余额
      realMoney() {
        let result = ''
        if (this.withdrawMoney) {
          result = this.withdrawMoney - this.withdrawMoney * 0.05
        }
        return result
      },
      bankcard() {
        if (this.$route.query.bankcard) {
          for (let i = 0; i < this.bankcardList.data.length; i++) {
            if (this.bankcardList.data[i].mb_id == this.$route.query.bankcard) {
              return this.bankcardList.data[i] // 使用指定银行卡
            }
          }
        } else {
          for (let i = 0; i < this.bankcardList.data.length; i++) {
            if (this.bankcardList.data[i].is_default === '1') {
              return this.bankcardList.data[i] // 使用默认银行卡
            }
          }
          if (this.bankcardList.data.length > 0) {
            return this.bankcardList.data[0] // 没有默认银行卡，使用第一个银行卡
          }
        }
        return {} // 没有银行卡
      }
    },
    methods: {
      moneyLimit() {
        let restMoney = this.withdrawMoney % 100 // 余数
        if (restMoney > 0) {
          // this.$toast('提现金额需为100的倍数')
          this.withdrawMoney = this.withdrawMoney - restMoney
        }
      },
      gotoAddBankcard() {
        this.$router.push({name: 'bankcard-edit', query: {type: this.type, from: 'account-withdraw'}})
      },
      gotoBankcardList() {
        this.$router.push({name: 'bankcard-list', query: {type: this.type, from: 'account-withdraw'}})
      },
      confirmPwd() {
        if (!this.withdrawMoney) {
          this.$toast('请输入提现金额')
          return
        }
        if (!this.bankcard.mb_id) {
          this.$toast('请选择银行卡')
          return
        }
        let restMoney = this.withdrawMoney % 10 // 余数
        if (restMoney > 0) {
          this.$toast('提现金额需为10的倍数')
          return
        }
        payPwd({}, this.withdraw)
      },
      withdraw() {
        this.$request.withdraw(this.type, this.bankcard.mb_id, this.withdrawMoney).then(data => {
          this.$toast('提交成功')
          this.$router.push({name: 'my'})
        }).catch(e => {
          this.$toast('转出到银行卡：' + e.msg)
          console.error('提现失败', e)
        })
      }
    }
  }
</script>

<style>

</style>
